import { useState } from 'react';
import { Button, Form, Input, Message } from '@arco-design/web-react';
import smartfetch from '../../atoms/smartfetch';
import { Message as M1, Result as R1 } from '../api/lesson/add.api';
import api from '../../atoms/api';

export default function Add() {
	const [name, setname] = useState('');
	const [age, setage] = useState(0);
	const [birthday, setbirthday] = useState('');
	return <>
		<Form>
			<Form.Item label='姓名' required>
				<Input type='text' value={name} onChange={(val) => {
					setname(val);
				}} />
			</Form.Item>
			<Form.Item label='年龄' required>
				<Input type='number' value={age.toString()} onChange={(val) => {
					setage(Number(val));
				}} />
			</Form.Item>
			<Form.Item label='生日' required>
				<Input type='date' value={birthday} onChange={(val) => {
					setbirthday(val);	// 2021-11 12
				}} />
			</Form.Item>
			<Form.Item>
				<Button onClick={async () => {
					const ret = await smartfetch<R1, M1>(api['/api/lesson/add'], 'post', {
						age,
						name,
						birthday: new Date(birthday).getTime().toString()
					});
					if (ret.ok === true) {
						Message.success('保存成功');
					} else {
						Message.error(ret.message);
					}
				}} >提交</Button>
			</Form.Item>
		</Form>
	</>;
}
